<template>
  <div class="bg-light">
    <div class="container-title">密码</div>
    <Form :label-width="120" :rules="rule" ref="form" :model="psd">
      <Row class="pr">
        <Col span="9">
          <FormItem label="新密码" prop="password">
            <Input type="text" placeholder="请输入新密码" v-model="psd.password" :maxlength="60"/>
          </FormItem>
        </Col>
      </Row>
      <Row class="pr">
        <Col span="9">
          <FormItem label="重复密码" prop="newpassword">
            <Input type="text" placeholder="重复密码" v-model="psd.newpassword" :maxlength="60"/>
          </FormItem>
        </Col>
      </Row>
    </Form>
    <div class="footer-btns">
      <!-- <Button type="primary" size="large" class="ml" @click="onCancel">取消</Button> -->
      <Button type="primary" size="large" class="ml" @click="onSave">保存</Button>
    </div>
  </div>
</template>
<script>
  import FooterBtns from './FooterBtns';

  export default {
    props: {
      form: {
        type: Object
      }
    },
    components: {
      FooterBtns
    },
    mounted () {
    },

    data() {
      return {
        psd: {
          password: '',
          newpassword: '',
        },
        rule: {
          password: { required: true, type: 'string', message: '请输入密码', trigger: 'blur', min: 6 },
          newpassword: { required: true,type: 'string', message: '请再次输入密码', trigger: 'blur', min: 6 },
        }
      }
    },
    methods: {
      onSave() {
        if (this.psd.password !== this.psd.newpassword) {
          this.$Message.info('两次输入的密码不一致')
          return
        }
        this.$Modal.confirm({
        title: '更改',
        content: '确定更改密码？',
        onOk: () => {
          this.$ajaxPost(`/contract_store/update_password/${this.form.storeDTO.id}`, { password: this.psd.password, storeId: this.form.storeDTO.id  }).then(() => {
            this.$Notice.success({
              title: '更新成功'
            })
          })
        }
      })
      },
    },
    computed: {

    }
  }
</script>
